<template>
	<w-container class='pa-16 page-bg' :loading="isLoading">
		<w-navbar id="my-nav" title="活动中心"></w-navbar>
		<!-- banner -->
		<ActiveBanner @change="change" />
		<CategoryTab :tabList="tabList" :value="activityPage.category_id" @change='change'></CategoryTab>
		<!-- list -->
		<view class="mt-16">
			<w-activity-card v-for="item in activityList" :key="item.id" :item='item'></w-activity-card>
		</view>
		<w-loading :type="loadingType" emptyType="search" empty-top="100"></w-loading>
	</w-container>
</template>

<script>
	import ActiveBanner from './components/ActiveBanner'
	import CategoryTab from './components/CategoryTab'
	import {
		getActivityList
	} from '@/api/news/index.js'
	import {
		category
	} from '@/api/active/index.js'
	export default {
		data() {
			return {
				isLoading: true,
				activityList: [],
				activityPage: {
					page: 1,
					limit: 10,
					category_id: 1
				},
				tabList: [],
			}
		},
		components: {
			ActiveBanner,
			CategoryTab
		},
		methods: {
			getActivityList(search) {
				if (this.loadingType == 'loading') return;
				this.loadingType = 'loading'
				getActivityList(search).then(res => {
					this.isLoading = false
					if (search.page == 1) {
						this.activityList = []
					}
					if (res.data.data) {
						this.activityPage = search;
					}
					this.loadingType = 'none'
					this.activityList = this.activityList.concat(res.data.data);
					if (res.data.total == 0) {
						this.loadingType = 'empty'
					}
					uni.stopPullDownRefresh()
				})
			},
			//加载更多
			loadMore() {
				let search = JSON.parse(JSON.stringify(this.activityPage))
				search.page++
				this.getActivityList(search);
			},
			getCategory() {
				category().then(res => {
					res.data.forEach(item=>{
						item.name = this.handleLang(item.name)
					})
					this.tabList = res.data
				})
			},
			change(id) {
				this.activityPage.category_id = id
				this.getActivityList(this.activityPage);
			}
		},
		onReachBottom() {
			this.loadMore();
		},
		onPullDownRefresh() {
			this.getActivityList(this.activityPage);
		},
		onLoad() {
			this.getCategory()
			this.getActivityList(this.activityPage);
		}
	}
</script>

<style>

</style>